<template>
	<view class="my_store">
		<view class="my_store_top">
			<view class="my_store_title">
				<CustomNav navTitle="我的店铺"></CustomNav>
			</view>
			<view class="my_store_inquire">
				<view class="my_store_inquire_date">
					<view class="my_store_inquire_startDate">
						请选择开始日期<image src="@/static/image/datePullDown.png" mode=""></image>
					</view>
					<view class="my_store_inquire_endDate">
						请选择结束日期<image src="@/static/image/datePullDown.png" mode=""></image>
					</view>
				</view>
				<view class="my_store_inquire_query">
					查询
				</view>
			</view>
		</view>
		<view class="my_store_data">
			<view class="my_store_data_list">
				<view class="my_store_data_listitem">
					<text class="my_store_data_item_name">总交易金额（元）</text>
					<text class="my_store_data_item_money">¥100000.00</text>
				</view>
				<view class="my_store_data_listitem">
					<text class="my_store_data_item_name">获得返利（元）</text>
					<text class="my_store_data_item_money">¥100000.00</text>
				</view>
				<view class="my_store_data_listitem">
					<text class="my_store_data_item_name">个人交易（元）</text>
					<text class="my_store_data_item_money">¥100000.00</text>
				</view>
			</view>
		</view>
		<view class="trading_record">
			<view class="trading_record_title flex flex-pack-justify tc">
				<text>用户</text>
				<text>手机号</text>
				<text>交易金额</text>
				<text>交易时间</text>
			</view>
			<view class="trading_record_list flex flex-pack-justify tc">
				<text>用户vdrg</text>
				<text>133****5555</text>
				<text>¥1000.00</text>
				<text>¥2020-06-06</text>
			</view>
		</view>
	</view>
</template>

<script>
	import CustomNav from '@/components/CustomNav/index.vue'
	export default {
		data() {
			return {
			}
		},
		methods: {
			// 返回上一页
			handleGoBack() {
				uni.navigateBack()
			}
		},
		components: {
			CustomNav
		},
		onLoad() {
		},
	}
</script>

<style lang="less" scoped>
	@import "@/asset/less/base.less";
	.my_store {
		.my_store_top {
			height: 557rpx;
			background: url(../../../static/image/memberBackgroundI.png) center;
			background-size: 100% 100%;
			.my_store_inquire_date {
				padding: 0 47rpx 50rpx 34rpx;
				display: flex;
				justify-content: space-between;
				view {
					font-size: 28rpx;
					color: #BBBBBB;
					text-align: center;
					border: 1px solid #A0A0A0;
					height: 78rpx;
					width: 325rpx;
					line-height: 78rpx;
					image {
						width: 22rpx;
						height: 13rpx;
						vertical-align: middle;
						margin-left: 28rpx;
					}
				}
				view:first-child {
					margin-right: 38rpx;
				}
			}
			.my_store_inquire_query {
				margin: auto;
				width: 273rpx;
				height: 70rpx;
				font-size: 28rpx;
				text-align: center;
				line-height: 70rpx;
				color: #fff;
				background-color: #DBB87B;
				border-radius: 8rpx;
			}
		}
		.my_store_data {
			margin: -155rpx 24rpx 0;
			background-color: #FFFFFF;
			box-shadow: 0px 1px 25rpx 0px rgba(139, 139, 139, 0.4);
			border-radius: 10rpx;
		}
		.my_store_data_list {
			padding: 0 50rpx 60rpx 55rpx;
			.my_store_data_listitem {
				padding-top: 70rpx;
				.my_store_data_item_name {
					font-size: 30rpx;
				}
				.my_store_data_item_money {
					float: right;
					font-size: 36rpx;
					line-height: 55rpx;
					color: #333;
				}
				text {
					color: #212121;
				}
			}
		}
		.my_store_data_listitem:first-child {
			padding-top: 51rpx;
		}
		.trading_record {
			border-radius: 10rpx;
			box-shadow: 0px 1px 25rpx 0px rgba(139, 139, 139, 0.4);
			margin: 20rpx 20rpx 0;
			padding-bottom: 100rpx;
			.trading_record_title {
				height: 90rpx;
				line-height: 90rpx;
				color: #654514;
				font-size: 30rpx;
				padding: 0 36rpx;
				background: linear-gradient(90deg, #CFA461 0%, #DCBB7E 100%);
				border-radius: 10rpx 10rpx 0px 0px;
			}
		}
		.trading_record_list {
			color: #333;
			padding: 0 34rpx 0 17rpx;
			border-bottom: 1px solid #E5E5E5;
			height: 90rpx;
			line-height: 90rpx;
			font-size: 24rpx;
		}
	}
</style>
